*{padding:0;margin:0;text-decoration: none;list-style: none;font-family: "微软雅黑"}
body{background: black;overflow: hidden;
overflow-y:scroll;width: 100%;}
header{width: 100%;height: 80px;background: black;}
header>div{width: 1000px;margin: 0 auto;}
header>div>ul{float: right;position: relative;background: none;}
header>div>ul>li{float: left;}
header>div>.ct{display: none;}
header>div>form{display: none;}
.on {font-weight: bold;}
header>div>ul>li>a{display: inline-block;color: white;padding: 30px;transition: all 0.5s;position: relative;z-index: 99;}
header>div>ul>li>a:hover{transform: scale(1.1);font-weight:bold;color:black;}
.black{display: block;position: absolute;width: 80px;height: 60px;background:#FBCC0A;left:7px;transition: all 0.5s;border-radius: 10px;top:10px;}
header>div>ul>li:nth-child(1):hover~ .black{left:7px;width: 80px;}
header>div>ul>li:nth-child(2):hover~ .black{left:100px;width: 110px;}
header>div>ul>li:nth-child(3):hover~ .black{left:220px;width: 110px;}
header>div>ul>li:nth-child(4):hover~ .black{left:345px;width: 110px;}
header>div>ul>li:nth-child(5):hover~ .black{left:470px;width: 110px;}
header>div>ul>li:nth-child(6):hover~ .black{left:595px;width: 110px;}	
.box{;min-width:1000px;margin:0 auto;position:relative;width: 100%;overflow:hidden;}
.animate>p{color:white;font-weight: bold;font-size: 20px;line-height: 30px;height: 30px;}
section>ul{width: 100%;}
section>ul>li{width: 100%;min-width:1000px;transition: all 1s;}
section>ul>li:nth-child(1){z-index: 2;position: relative;}
section>ul>li:nth-child(2){z-index: 1;position: absolute;}
section>ul>li:nth-child(3){z-index: 1;position: absolute;}
section>ul>li>img{width: 100%;min-width: 1000px;height: auto;}

section .alt{position: absolute;bottom:0%;background: rgba(0,0,0,0.6);color: white;font-weight: bold;font-size: 100%;;width: 100%;z-index: 999;}
section .alt>p{height: 30px;text-indent: 30px;padding-top: 10px;}
.btn_l{position: absolute;top:44%;z-index: 9999;left: 0;width: 40px;height: 60px;background: url(../images/themes.gif);cursor:pointer;opacity: 0.7;}
.btn_r{position: absolute;top:44%;z-index:9991;right:0;width: 40px;height: 60px;background: url(../images/themes.gif) 40px;cursor:pointer;opacity: 0.7;}
.box .animatr{width: 370px;height:60px;background: rgba(0,0,0,0.3);position:absolute;top:20%;left:10%;z-index:999999;padding-left: 20px;border-radius: 5px;}
.box .animatr>p{color:white;font-size: 20px;line-height: 30px;font-weight: bold;}

.daohang{display: none;}

article{display: flex;background:black }
article>ul{flex-grow:  1;min-width: 300px;text-align:center;}
article ul li {margin: 20px 0;}
article ul li a{transition: all 0.5s;display: block;}
article ul li a:hover{transform: scale(1.1);}
article ul li a img{width: 100%;max-width: 390px;}
article ul li a p{color:white;line-height: 30px;height: 30px;}
footer{width: 100%background:#0d0e10;font-size: 12px;}
footer nav{width:500px;margin:20px auto;}
footer nav ul li{text-align: center;line-height: 30px;height: 30px;color:#4a4a4a;}


@media screen and (max-width: 800px) {
 

  body{background: black;}
   
  
 header{height: 50px;}

 header>div{width: 100%;}
 header>div img{width: 30%;max-width:100px;float: left;margin-top:5px;}
  header>div>ul{display: none;;margin-right: -90px;position: absolute;right:80px;top:50px;z-index: 99999;}
 header>div>.ct{display: block;float:right;width:33px;height: 33px;background:url(../images/feilei.png)no-repeat;margin-right: 20px;cursor: pointer;margin-top: 10px;background-size:90%; }
header>div>ul>li{float: none;}
header>div>ul>li>a{background:rgba(0,0,0,0.5);display: inline-block;width: 90px;height: 40px;padding: 0;text-align:center;line-height: 40px;}
header>div>ul>li>a:hover{transform: none;color: white;}
header .black{display: none;}
header>div>form{display: block;float:left;margin-top: 10px;margin-left: 3%;width: 50%;}
header>div>form>input[type=text]{width:50%;height: 30PX;border:none;background:white;text-indent: 20px;border-radius:15px 0 0 15px; }
header>div>form>input[type=button]{width:33px;height: 30px; vertical-align:top;border: none;background: url(../images/search-btn.png)white no-repeat center center;border-radius:0 15px  15px 0;margin-left: -5px;background-size:50%;}
.btn_l{display: none;}
.btn_r{display: none;}
.box{min-width:320px;margin:0 auto;position:relative;width: 100%;overflow:hidden;}

section>ul>li{width: 100%;min-width:320px;}
section>ul>li>img{width: 100%;min-width: 320px;height: auto;}
section>div{display: none;}

article{display:block;background:black }
article>ul{width: 100%}
article ul li {width: 100%;height: auto;}
article ul li a{}
article ul li a:hover{transform:none;}
article ul li:nth-child(1) a img{float: left;width: 50%;}
article ul li:nth-child(2) a img{float: right;width: 50%;}

article ul li a p{height: 28%;}





}
@media screen and (max-width: 600px){

  footer{display: none;}
}
	</style>